Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[RFR] I18n provider new signature #3685

Merged
merged 13 commits into from
Sep 13, 2019
Merged

[RFR] I18n provider new signature #3685

merged 13 commits into from
Sep 13, 2019
+649 −310

Conversation

fzaninotto
Copy link
Member

In order to allow different translation frameworks than Polyglot (#2307), or to pass options to the Polyglot constructor (#3662, #758, #366), we need to move some react-admin logic inside the i18nProvider.

With this PR, the i18nProvider has a signature similar to the other providers: it accepts a message type (either I18N_TRANSLATE or I18N_CHANGE_LOCALE) and a params argument.

// react-admin 2.x
const i18nProvider = (locale) => messages[locale];

// react-admin 3.x
const i18nProvider = (type, params) => {
    const polyglot = new Polyglot({ locale: 'en', phrases: messages.en });
    let translate = polyglot.t.bind(polyglot);
    if (type === 'I18N_TRANSLATE') {
        const { key, options } = params;
        return translate(key, options);
    }
    if type === 'I18N_CHANGE_LOCALE') {
        const newLocale = params;
        return new Promise((resolve, reject) => {
            // load new messages and update the translate function
        })
    }
}

But don't worry: react-admin v3 exports a function called polyglotI18nProvider, that you can just wrap around your old i18nProvider to make it compatible with the new provider signature:

import React from 'react';
-import { Admin, Resource } from 'react-admin';
+import { Admin, Resource, polyglotI18nProvider } from 'react-admin';
import englishMessages from 'ra-language-english';
import frenchMessages from 'ra-language-french';

const messages = {
    fr: frenchMessages,
    en: englishMessages,
};
const i18nProvider = locale => messages[locale];

const App = () => (
-   <Admin locale="en" i18nProvider={i18nProvider}>
+   <Admin locale="en" i18nProvider={polyglotI18nProvider(i18nProvider)}>
        ...
    </Admin>
);

export default App;

@fzaninotto fzaninotto added this to the 3.0.0 milestone Sep 12, 2019
This was referenced Sep 12, 2019
Closed
Closed
djhi
djhi requested changes Sep 13, 2019
View reviewed changes
Copy link
Collaborator

@djhi djhi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While we are at it, why not extracting the default i18nProvider using polyglot in its own package ? People implementing it with another library will not need this dependency

UPGRADE.md Outdated Show resolved Hide resolved
packages/ra-core/src/i18n/useSetLocale.tsx Show resolved Hide resolved
packages/ra-core/src/i18n/useTranslate.ts Show resolved Hide resolved
djhi
djhi requested changes Sep 13, 2019
View reviewed changes
packages/ra-core/package.json Outdated Show resolved Hide resolved
@djhi djhi merged commit 2f347d8 into next Sep 13, 2019
@djhi djhi deleted the i18nProvider_new_signature branch September 13, 2019 10:19
@fzaninotto fzaninotto mentioned this pull request Sep 13, 2019
Closed
40 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@djhi djhi djhi approved these changes

Assignees
No one assigned
Labels
breaking change
Projects
None yet
Milestone
3.0.0
Development

Successfully merging this pull request may close these issues.
2 participants
@fzaninotto @djhi